
<!-- 此组件只在web中显示 -->
<template>
    <view :class="{'downloadBox':true, 'topShow':showTip}" v-if="hasTip">
        <view class="left_app_info">
            <view class="btn_close_appDownload a" @click="hideDownTip(true)">
                <image
                    :src="masterDomain + '/static/images/close_down.png'"
                    mode="aspectFit"
                ></image>
            </view>
            <view class="downloadLogo">
                <image :src="cfg_appinfo.logo" mode="aspectFit"></image>
            </view>
            <view class="h3">{{cfg_appinfo.subtitle}}</view>
        </view>
        <view class="app_btn_down a" @click="H5ToApp()" >
            <view class="btn_style" >打开APP</view>
            <view class="wxDownLoad" v-if="isWeixin && wx_for">
                <wx-open-launch-app id="launch-btn" :appid="cfg_appinfo.wx_appid" :extinfo="url_path == masterDomain || url_path.replace(masterDomain,'') == '/' ? '' : url_path"  @launch="changeLaunch" @error="launchFail">
                    <view v-is="'script'" type="text/wxtag-template">
                        <view class="downLoadBtn a" style="width:100px; height:100px; opacity:0;">打开APP</view>
                    </view>
                </wx-open-launch-app>
            </view>
        </view>
    </view>
</template>

<script>
    const app = getApp();
    export default{
        data(){
            return{
                hasTip:false, //是否生成下载提示
                showTip:false,  //控制提示显示/隐藏
                platForm:app.globalData.platForm,
                appBoolean:app.globalData.appBoolean,
                globalData:app.globalData, 
                masterDomain:app.globalData.masterDomain,
                cfg_appinfo:app.globalData.appConfig.cfg_app_info && app.globalData.appConfig.cfg_app_info.basic || {},
                isWeixin:false, //表示在微信浏览器中 
                wx_for:false, //验证微信版本号是否适合  微信版本号是否大于7.0.12
                device:'', //设备信息
                isIOS9:'',
                appConfig:{}, //app配置信息
            }
        },
        props:{

        },

        mounted(){
            const that = this;
            that.checkTipShow()
            
        },
        methods:{
            /**
             * 验证是否显示 生成下载提示
             * 1.
             * */ 
            checkTipShow(){
                const that = this;
                let downloadAppTips =  $.cookie('downloadAppTips')
                let cfg_appinfo = that.globalData.appConfig.cfg_app_info && that.globalData.appConfig.cfg_app_info.basic || {}

                if(that.platForm == 'web' && !app.globalData.appBoolean && !downloadAppTips && window.__wxjs_environment != 'miniprogram' && cfg_appinfo && cfg_appinfo.logo){
                    that.hasTip = true;
                    let device = window.navigator.userAgent.toLowerCase();
                    var isWeixin = device.toLowerCase().indexOf('micromessenger') != -1;
                    var wx_stringArr = isWeixin ? device.toLowerCase().match(/micromessenger\/([\d\.]+)/i) : 0;
                    var wx_version = wx_stringArr.length > 0 ? device.toLowerCase().match(/micromessenger\/([\d\.]+)/i)[1] : 0; //微信版本号
                    var wx_for = isWeixin ? (wx_version.split('.')[0] >= 7 || (wx_version.split('.')[1] >= 0 && wx_version.split('.')[0] == 7) || (wx_version.split('.')[2] >= 12 && wx_version.split('.')[0] == 7 && wx_version.split('.')[1] == 0)) : 0;//微信版本号是否大于7.0.12
                    var iOSver = (navigator.appVersion).match(/OS (\d+)_(\d+)_?(\d+)?/);  //ios版本信息
                    var isIOS9 = iOSver ? iOSver[1] : 0; //ios的版本
                    var url_path = window.location.href;
                    that.isWeixin = isWeixin
                    that.wx_for = wx_for
                    that.url_path = url_path
                    that.isIOS9 = isIOS9
                    that.device = device
                    if(cfg_appinfo && cfg_appinfo != {}){
                        var paramUrlAnd = url_path == that.masterDomain || url_path.replace(that.masterDomain,'') == '/' ? "" : '?url=' + url_path;
                        var paramUrlIos = '://?url=' + url_path;
                        var appConfig = {
                            scheme_IOS: cfg_appinfo.URLScheme_iOS ? (cfg_appinfo.URLScheme_iOS + paramUrlIos) : (that.masterDomain + '/mobile.html'),
                            scheme_Adr: cfg_appinfo.URLScheme_Android ? ('portal://' + cfg_appinfo.URLScheme_Android + ':8000/splash' + paramUrlAnd) : (that.masterDomain + '/mobile.html'),
                            download_url_IOS: that.masterDomain + '/mobile.html',
                            timeout: 600
                        }
                        that.appConfig = appConfig;
                    }

                   setTimeout(() => {
                     that.$nextTick(() => {
                        that.showTip = true;
                        setTimeout(() => {
                            that.showTip = false;
                        }, 8000);
                     })
                   }, 1000);
                }
            },

            /**
             * 关闭下载提示
             * @param {Boolean} isClick 表示手动关闭  手动关闭当天不再显示
            */
            hideDownTip(isClick = false){
                const that = this;
                that.showTip = false;
                if(isClick){
                    $.cookie('downloadAppTips', 1, { expires: 1, path: '/' });
                }
            },

            H5ToApp(){
                const that = this;
                let appConfig = that.appConfig
                if (that.isWeixin && !that.wx_for) {
                    window.location.href = appConfig.download_url_IOS
                } else if (!that.isWeixin) {
                    that.openclient();
                }
            },

            /***
             * 打开/下载app
             * */
             openclient(){
                const that = this;
                let device = that.device,appConfig = that.appConfig;
                let isIOS9 = that.isIOS9

                var startTime = Date.now();
                // 用户点击时，在动态创建一个iframe，并且让这个iframe去加载config中的Schema
                var ifr = document.createElement('iframe');
                // 端口判断 安卓或IOS
               
                ifr.src = (device.indexOf('android') > -1 || device.indexOf('linux') > -1) ? appConfig.scheme_Adr : appConfig.scheme_IOS;
                ifr.style.display = 'none';
                if (isIOS9 >= 9) {
                    window.location.href = appConfig.scheme_IOS;
                    setTimeout(function () {
                        window.location.href = appConfig.download_url_IOS
                    }, appConfig.timeout)
                } else {
                    document.body.appendChild(ifr);
                }
                var t = setTimeout(function () {
                    var endTime = Date.now();
                    //指定的时间内没有跳转成功 当前页跳转到apk的下载地址
                    if ((endTime - startTime) < (appConfig.timeout + 200)) {
                        //判断是安卓 还是IOS
                        if (/iphone|ipad|ipod/.test(device.toLowerCase())) {
                            window.location.href = appConfig.download_url_IOS;
                        } else if (/android/.test(device.toLowerCase())) {
                            window.location.href = appConfig.download_url_IOS;
                        }
                    } else {
                        window.close();
                    }
                }, appConfig.timeout);

                window.onblur = function () {
                    clearTimeout(t);
                }
             } ,



            //  微信打开app
            changeLaunch(e){
                console.log(e)
            },

            // 跳转失败
            launchFail(){
                window.location.href = this.appConfig.download_url_IOS;
            },
        }
    }
</script>

<style scoped>
    @import './download_tip.css';
</style>